<%@ include file="/WEB-INF/views/commonJSTL.jsp" %>
<%@page contentType="text/html" pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<title>${s_UserPharmacy.pharmacy.name}</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<%@ include file="/WEB-INF/views/commonResources.jsp" %>

<script type="text/javascript">
	$(document).ready(function(){
		$("#countryId").change(function(){
	        $("#countryId option:selected").each(function (){
	       		location.href = "pharmacies?_menuId=1&_subMenuId=2&_optionId=1&_countryId="+$(this).val();
	        });
	    });	
		$("#regionId").change(function(){
			if($("#regionId").val() != ''){
		        $("#regionId option:selected").each(function (){
		        	mainPharmacies($("#countryId").val(),$(this).val());
		        });
	        }else{
	        	location.href = "pharmacies?_menuId=1&_subMenuId=2&_optionId=1&_countryId="+$("#countryId").val();
	        }
	    });
	});
	function newPharmacies(countryId,regionId){
		location.href = "pharmaciesNew?_menuId=1&_subMenuId=2&_optionId=1&_countryId="+countryId+"&_regionId="+regionId;	
	}
	function editPharmacies(countryId,regionId,pharmacyId){
		location.href = "pharmaciesEdit?_menuId=1&_subMenuId=2&_optionId=1&_countryId="+countryId+"&_regionId="+regionId+"&_pharmacyId="+pharmacyId;	
	}
	function giveLowPharmacies(countryId,regionId,pharmacyId,name){
	    if(confirm("¿Estas seguro de dar de baja a la Farmacia: "+name+"?")){
            $.ajax({
                url: "ajaxGiveLowOrHighToPharmacy",
                type: "GET",
                data:{pharmacyId:pharmacyId,active:false},
                beforeSend:function(obj){
                    $('#listUser').css({display:'none'});
                    $('#imgLoad').css({display:'block'});
                },
                success:function(res){
                	alert(res);
                	mainPharmacies(countryId,regionId);
                },
                complete:function(){
                    $('#imgLoad').css({display:'none'});
                    $("#listUser").css({display:'block'});
                },
                error: function(res){ alert("Error! al dar de Baja"); }
            });
        }
	}
	function giveHighPharmacies(countryId,regionId,pharmacyId,name){
		if(confirm("¿Estas seguro de dar de alta a la Farmacia: "+name+"?")){
            $.ajax({
                url: "ajaxGiveLowOrHighToPharmacy",
                type: "GET",
                data:{pharmacyId:pharmacyId,active:true},
                beforeSend:function(obj){
                    $('#listUser').css({display:'none'});
                    $('#imgLoad').css({display:'block'});
                },
                success:function(res){
                	alert(res);
                	mainPharmacies(countryId,regionId);
                },
                complete:function(){
                    $('#imgLoad').css({display:'none'});
                    $("#listUser").css({display:'block'});
                },
                error: function(res){ alert("Error! al dar de Alta"); }
            });
        }
	}
	
	function showHide(){
	    if( $("#low").css('display') == 'none' ){
	        $("#low").css('display', 'block');
	        $("#showHide").attr('value', 'Ocultar Bajas');
	        $("#showHide").attr('title', 'Pulsa aqui para ocultar bajas')
	    }else{
	        $("#low").css('display', 'none');
	        $("#showHide").attr('value', 'Mostrar Bajas');
	        $("#showHide").attr('title', 'Pulsa aqui para mostrar bajas')
	    }
	}
	
	function mainPharmacies(countryId,regionId){
		location.href = "pharmacies?_menuId=1&_subMenuId=2&_optionId=1&_countryId="+countryId+"&_regionId="+regionId;
	}
</script>
</head>

<body>
<div id="top-wrap">
	<%@include file="../../../head.jsp"  %>
	<div id="bodySpace">
		
	    <div class="clearfix" id="middle" style="position: absolute">  <!-- aqui va la ruta -->
	        <!-- aqui va el arbol de entrada -->
	        <div id="breadcrumb">
	            <ul>
                	<li><a href="<spring:url value="/mainFront?" htmlEscape="true" />">Home</a></li>	
                    <li><span style="color:#666"><fmt:message key="title.configuration"/></span></li>
                    <li><span style="color:#666"><fmt:message key="title.customers"/></span></li>
                    <li class="current-page"><span class="end"><span class="middle"><fmt:message key="title.pharmacies"/></span></span></li>
                </ul>
	        </div>
	    </div>
	    
	    <div id="principal">
            <!-- izquierda -->
            <div class="cuerpo2y" style="border: 0px solid"><br/><br/><!-- estos break son necesarios ya q uso absolute en css  cuerpo izquierdo-->
                <div class="izq">
					<%@include file="../../../bodyIzq.jsp" %>	
                </div>
                
                <div class="medio" style="border: 0px solid">
					<h2 class="decorado"><fmt:message key="title.pharmacies"/> <fmt:message key="show.in"/> ${nameCountry}</h2></br></br> 
					
					<div id="imgLoad" style="float: left;width: 100%;display: none;"><img src="<c:url value="/resources/images/imgLoad/ajax-loader.gif" />" width="32" height="32" alt="ajax-loader.gif" style="position:absolute; top:30%; left:50%;"/></div> 
					<div id="pharmacies">
						<center> 
							<label for="countryId" ><b><fmt:message key="show.form.selected.country"/> :</b></label>					
							<select name="countryId" id="countryId"  title="<fmt:message key="show.form.selected.country"/>">
								<option value=""><fmt:message key="show.form.selected"/></option>
								<c:forEach var="item" items="${listCountry}">
									<c:set var="selec" value="" />
                               		<c:if test="${param._countryId == item.countryId}">
                                		<c:set var="selec" value="selected='selected'" />
                               		</c:if>
									<option value="${item.countryId}" ${selec}>${item.name}</option>    
								</c:forEach>
							</select>
							&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
							<label for="regionId" ><b><fmt:message key="show.form.selected.region"/> :</b></label>					
							<select name="regionId" id="regionId"  title="<fmt:message key="show.form.selected.region"/>">
								<option value=""><fmt:message key="show.form.selected"/></option>
								<c:forEach var="item" items="${listRegion}">
									<c:set var="selec" value="" />
                               		<c:if test="${param._regionId == item.regionId}">
                                		<c:set var="selec" value="selected='selected'" />
                               		</c:if>
									<option value="${item.regionId}" ${selec}>${item.name}</option>    
								</c:forEach>
							</select><br/><br/>			
						</center>		
						<c:if test="${param._regionId != null}" >
							<table class="miReporte" style="width: 100%">
								<tr>
									<td style="text-align: right"><input type="button" class="boton" value="<fmt:message key="button.add"/> <fmt:message key="title.pharmacy"/>" onclick="newPharmacies('${param._countryId}','${param._regionId}')" title='<fmt:message key="onclick.add"/> <fmt:message key="title.pharmacy"/>.'/></td>
								</tr>
							</table>
						</c:if>
						<c:if test="${(not empty listPharmacy) || (not empty listPharmacyInactive)}" >
							<table class="tabla_decorado" style="width: 100%">
								<thead>
									<tr>
										<th width="4%" class="th_decoradoRowspan"><fmt:message key="table.num"/></th>
										<th width="20%" class="th_decoradoRowspan"><fmt:message key="table.name"/></th>
										<th width="20%" class="th_decoradoRowspan"><fmt:message key="table.email"/></th>
										<th width="26%" class="th_decoradoRowspan"><fmt:message key="table.address"/></th>
										<th width="30%" class="th_decoradoRowspan"><fmt:message key="table.actions"/></th>
									</tr>
								</thead>
								<tbody>
									<c:set var="i" value="1"/>
									<c:forEach var="item" items="${listPharmacy}"> 
										<tr class="tr_decorado">
											<td class="th_decorado" style="text-align: center">${i}</td>
											<td class="th_decorado">${item.name}</td>
											<td class="th_decorado">${item.email}</td>
											<td class="th_decorado">${item.address}</td>
											<td class="td_decoradoDerecha" style="text-align: center">
												<input type="button" value="<fmt:message key="button.edit"/>" onclick="editPharmacies('${param._countryId}','${param._regionId}','${item.pharmacyId}')" class="botonRep" title="<fmt:message key="onclick.edit"/> ${item.name}"/>
												<input type="button" value="<fmt:message key="button.low"/>" onclick="giveLowPharmacies('${param._countryId}','${param._regionId}','${item.pharmacyId}','${item.name}')" class="botonRep" title="<fmt:message key="onclick.low"/> ${item.name}"/>
												<%-- <input type="button" value="<fmt:message key="button.remove"/>" onClick="" class="botonRep" title="<fmt:message key="onclick.remove"/>"/> --%>
											</td>
										</tr>
										<c:set var="j" value="1"/>
										<c:set var="i" value="${i+j}"/>
									</c:forEach>
								</tbody>
							</table>
							<table class="miReporte" style="width: 100%">
								<tr>
									<td style="text-align: right"><input type="button" name="showHide" id="showHide" value="<fmt:message key="show.low"/>" onclick="showHide()" class="boton" title="<fmt:message key="onclick.show.lows"/>"/></td>
								</tr>
							</table><br/><br/>	
							<c:choose>
								<c:when test="${(not empty listPharmacyInactive)}" >
									<div id="low" style="display:none;">
										<!-- <center> -->
										<h2 class="decorado"><fmt:message key="show.pharmaciesGiveLow"/></h2>
										<table class="tabla_decorado" style="width: 100%">
											<thead>
												<tr>
													<th width="4%" class="th_decoradoRowspan"><fmt:message key="table.num"/></th>
													<th width="20%" class="th_decoradoRowspan"><fmt:message key="table.name"/></th>
													<th width="20%" class="th_decoradoRowspan"><fmt:message key="table.email"/></th>
													<th width="26%" class="th_decoradoRowspan"><fmt:message key="table.address"/></th>
													<th width="30%" class="th_decoradoRowspan" colspan="1"><fmt:message key="table.actions"/></th>
												</tr>
											</thead>
											<tbody>
												<c:set var="i" value="1"/>
												<c:forEach items="${listPharmacyInactive}" var="item">
													<tr class="tr_decorado">
														<td class="th_decorado" style="text-align: center">${i}</td>
														<td class="th_decorado">${item.name}</td>
														<td class="th_decorado">${item.email}</td>
														<td class="th_decorado">${item.address}</td>
														<td class="td_decoradoDerecha" style="text-align: center"><input type="button" value="<fmt:message key="button.high"/>" onclick="giveHighPharmacies('${param._countryId}','${param._regionId}','${item.pharmacyId}','${item.name}')" class="botonRep" title="<fmt:message key="onclick.high"/> ${item.name}"/></td>
													</tr>
													<c:set var="j" value="1"/>
													<c:set var="i" value="${i+j}"/>
												</c:forEach>                              		
											</tbody>
										</table>
									</div>									
								</c:when>
								<c:otherwise>
									<p style='text-align:center;color:blue'>
										<fmt:message key="show.noExistPharmaciesGiveLow"/>
									</p>
								</c:otherwise>
							</c:choose>
						</c:if>	
					</div>	                              
                </div>
            </div><!--end of leftPan-->
            
            <div class="yDer" style="border: 1px solid #ccc;">
                  <%@include file="../../../notices.jsp" %>                       
            </div><!--end of rightPan-->
        </div><!--end main content -->
	</div>
</div>
</body>
</html>
